<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">

    <link rel="stylesheet" href="../../dist/mermaid.css"/>
    <script src="../../dist/mermaid.js"></script>
    <style>
        body{
            background-color: #89896f;
        }

    </style>

</head>
    <body>
        <h1>The diagrams below have leading comments</h1>
        <div class="mermaid" id="i211">
            %% Example diagram
        graph LR
            A["A double quote:#quot;"] -->B["A dec char:#9829;"]
            B                          -->C["#9829; ;^; #60;"]
        </div>
        <div class="mermaid" id="i211">
            %% Example diagram
            sequenceDiagram
            Ali#45;ce->>John: Hello John, how are you? #60;
            John-->>Alice: Great!#quot;
        </div>
    </body>
</html>
